//初始化Web Uploader
var uploader = WebUploader.create({
    
        auto: false,                                         //自动上传
        swf: '../plugins/webuploader/Uploader.swf',     // swf文件路径
        server: '/duan/upload_chunks',                    // 文件接收服务端。
        
        // 分片上传配置  
        chunked: true,// 开起分片上传。  
        chunkSize: 10240000,// 单位字节(Byte)  
        threads: 1,//上传并发数 



        pick: '#picker',                                     // 选择文件的按钮。可选。
        accept: {  
            title: 'doc',  
            extensions: 'txt,doc,docx',
            mimeTypes: 'text/plain,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document'  
        },
        // fileNumLimit: 10, //文件总数量, 超出则不允许加入队列                            //最大上传数量为10
        // fileVal: 'pic',
        // fileSingleSizeLimit: 2000 * 1024 * 1024,         //限制上传单个文件大小20M
        // fileSizeLimit: 2000 * 1024 * 1024,              //限制上传所有文件大小200M
        // resize: false,                                  // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
        // duplicate:true                                // 重复上传
    });
    
    //上传前的判断处理
    uploader.on('error', function( type ){
        if ( type === 'Q_EXCEED_NUM_LIMIT' ) {
            layer.msg('最多允许上传10份表格');
        } 
        if ( type === 'F_DUPLICATE' ) {
            layer.msg('文件重复，不能上传！');
        }
        if (type=="Q_TYPE_DENIED"){
            layer.msg("请上传xls格式文件");
        }else if(type=="F_EXCEED_SIZE"){
            layer.msg("文件大小不能超过2000M");
        }
    });
    
    // 当有文件被添加进队列的时候
    var $list = $("#thelist");
    uploader.on( 'fileQueued', function( file ) {
        $list.append( '<div id="' + file.id + '" class="item">' +
            '<h4 class="info">' + file.name + '</h4>' +
            '<p class="state">等待上传...</p>' + 
            '<a class="webuploadDelbtn cf">重新选择</a>&emsp;<a class="webuploadDelbtn">删除</a><br/><br/>' +
        '</div>' );
        $('#cf').css('display','none');
    });
    
    //点击开始上传
     $("#ctlBtn").on( 'click', function() {  
        uploader.upload();  
     });
    
    // 文件上传过程中创建进度条实时显示。
    uploader.on( 'uploadProgress', function( file, percentage ) {
        var $li = $( '#'+file.id ),
            $percent = $li.find('.progress .progress-bar');
    
        // 避免重复创建
        if ( !$percent.length ) {
            $percent = $('<div class="progress progress-striped active">' +
              '<div class="progress-bar" role="progressbar" style="width: 0%">' +
              '</div>' +
            '</div>').appendTo( $li ).find('.progress-bar');
        }
        $li.find('p.state').text('上传中');
        console.log(percentage)
        $percent.css( 'width', percentage * 100 + '%' );
    });
    
    
    //文件成功、失败处理
    uploader.on( 'uploadSuccess', function( file ) {

        console.log(file);

        // 如果是分片上传,文件上传成功后执行分片合并并返回Get文件的url
        if (uploader.options.chunked) {
            $.post('/duan/merge_chunks', {
                'hash': md5([file.id, file.name, file.size, file.type, file['__hash']].join('')),
                'name': file.name,
                'size': file.size
            }, function (data) {
                console.log(data)
                if (data.status) {
                    $('#' + file.id).find('p.state').text('已上传');
                    $('#' + file.id).find('.progress-bar').css({
                        'background-image': 'url(' + data.url + ')',
                        'background-size': 'cover',
                        'background-repeat': 'no-repeat'
                    });
                } else {
                    $('#' + file.id).find('p.state').text('上传错误!');
                }
            }, 'json');
        }
     



    
        // $( '#'+file.id ).find('p.state').text('已上传');
        // $( '#'+file.id ).find('p.state').addClass('su');
        // $( '#'+file.id ).find('a.webuploadDelbtn').remove();
    });
    //上传错误
    uploader.on( 'uploadError', function( file ) {
        console.log(file)
        $( '#'+file.id ).find('p.state').text('上传出错');
        $( '#'+file.id ).find('p.state').addClass('active');
        $( '#'+file.id ).find('a.webuploadDelbtn').css('display','none');
    });
    //上传完成
    uploader.on( 'uploadComplete', function( file ) {
        $( '#'+file.id ).find('.progress').fadeOut();
        // uploader.reset();
        $('#cf').css('display','block');
    });
    
    
    //删除
    $list.on("click", ".webuploadDelbtn", function () {
        var $ele = $(this);
        var id = $ele.parent().attr("id");
        var file = uploader.getFile(id);
        uploader.removeFile(file,true);  
        if($(this).hasClass('cf')){
            $('#picker input').trigger('click');
        }
    }); 
    
    //删除时执行的方法
    uploader.on('fileDequeued', function (file) {
        $(file.id).remove();
        $('#'+file.id ).find('span.state').text('已经取消');
        $('#'+file.id).hide();   
        console.log("remove");     
    }); 
    
    // 再次上传
    $('#cf button').on('click',function(){
        $('#picker input').trigger('click');
    })